{% extends "base.html"  %}
{% load static %}
{% block link %}
<link rel="shortcut icon" href="{% static "favicon.ico" %}">
<link rel="stylesheet" href="{% static "css/common.css" %}">
<link rel="stylesheet" href="{% static "css/register.css" %}">
<script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://unpkg.com/mobi.css/dist/mobi.min.css">
{% endblock %}

{% block body  %}
<body class="review">
<div class="wrapper">
<div class="header clearfix">
<a href="/index" class="logo">电子公文传输系统</a>
<span class="logo-tip">Hi,欢迎您!</span>
</div>
<div class="content clearfix">
<!-- 登录注册版块 -->
<div id="unauth_main" class="login-regist">
<div class="login-box switch_box" style="display:block;">
    <div class="title">用户登录</div>
    <form id="loginForm" class="formBox" action="" method="post">
        {% csrf_token %}
        <div class="itembox user-name">
            <div class="item">
                <input type="text" name="loginUser" placeholder="用户名" class="txt tabInput">
            </div>
        </div>
        <div class="itembox user-pwd">
            <div class="item">
                <input type="password" name="password" placeholder="登录密码" class="txt tabInput">
            </div>
        </div>
        <div>
            <div style="height: 40px">
                <div>{{ form.captcha }}</div>
            </div>
        </div>
        {% if tips %}
            <div>提示:<span>{{ tips }}</span></div>
        {% endif %}
        <div id="loginBtnBox" class="login-btn">
            <input id="J_LoginButton" type="submit" value="马上登录" class="tabInput pass-btn" />
        </div>
        <div class="pass-reglink">
            <!--还没有我的账号？-->
            <a class="switch" href="javascript:;">免费注册</a>
        </div>
    </form>
</div>
<!-- //登录版块end -->
<div class="regist-box switch_box" style="display:none;">
    <div class="title">用户注册</div>
    <form id="registerForm" class="formBox" method="post" action="">
        {% csrf_token %}
        <div id="registForm" class="formBox">
        <div class="itembox user-name">
        <div class="item">
            {{ user.username }}
        </div>
        </div>
        <div class="itembox user-name">
        <div class="item">
            {{ user.email }}
        </div>
        </div>
        <div class="itembox user-pwd">
        <div class="item">
            {{ user.password1 }}
        </div>
        </div>
        <div class="itembox user-pwd">
        <div class="item">
            {{ user.password2 }}
        </div>
        </div>
        {% if tips %}
            <div>提示:<span>{{ tips }}</span></div>
        {% endif %}
        <!--<div class="member-pass clearfix">
            <input id="agree" name="agree" checked="checked" type="checkbox" value="1">
            <label for="agree" class="autologon">已阅读并同意用户注册协议</label>
        </div>-->
            <input type="submit" value="免费注册" id="J_RegButton" class="pass-btn tabInput"/>
            <div class="pass-reglink">
                <!--已有帐号，-->
                <a class="switch" href="javascript:;" style="left: auto">立即登录</a>
            </div>
        </div>
    </form>
</div>
<!-- //注册版块end -->
</div>
<div width="300px" align="center"><img src="{% static "image/bigLogo.jpg" %}"></div>
</div>
</div>
<script>
    $(function(){
        $('.captcha').click(function(){
            console.log('click');
                $.getJSON("/captcha/refresh/",
            function(result){
                $('.captcha').attr('src', result['image_url']);
                $('#id_captcha_0').val(result['key'])
            });});
        $('#id_captcha_1').blur(function(){
            json_data={
                'response':$('#id_captcha_1').val(),
                'hashkey':$('#id_captcha_0').val()
            }
            $.getJSON('/ajax_val', json_data, function(data){
                $('#captcha_status').remove()
                if(data['status']){
                    //$('#id_captcha_1').after('<span id="captcha_status">*验证码正确</span>')
                }else{
                    //$('#id_captcha_1').after('<span id="captcha_status">*验证码错误</span>')
                    alert('验证码错误')
                }
            });
        });
    })
</script>
<script data-main="{% static "js/register.js" %}" src="{% static "js/require.js" %}"></script>
</body>
{% endblock  %}
